.box {
  background-color: pink;
  width: 100px;
  height: 100px;
  border: 1px solid #c45454;
  margin: 20px;
}
.box {
  --mainColor: green;
}
.box > .text1 {
  color: aqua;
}
.box .text2 {
  color: blue;
}
.box :hover {
  color: red;
}
.box:hover {
  color: red;
}
.box_header {
  width: 100px;
  height: 100px;
  background-color: yellow;
}
.box_center {
  width: 100px;
  height: 100px;
  background-color: gray;
}
.box_bottom {
  width: 100px;
  height: 100px;
  background-color: yellow;
}
.box .box3 {
  background-color: var(--mainColor);
  width: 100px;
  height: 100px;
}
